<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			div {
				width: 400px;
				height: 400px;
				text-align: center;
				line-height: 400px;
				font-size: 25px;
				background-image: url(images/time.jpg);
			}
		</style>

		<script type="text/javascript">
			function show() {
				var date = new Date(); //初始化一个对象date

				var hour = date.getHours();
				var min = date.getMinutes();
				var sec = date.getSeconds(); //时分秒

				var res = format(hour) + ":" + format(min) + ":" + format(sec);
				document.getElementById("time").innerHTML = res; //通过div获得ID;改变标签中的文本
			}

			function format(num) {
				if (num < 10) {
					num = "0" + num;
				}
				return num;
			}
		</script>

		<script type="text/javascript">
			function changeColor() {

				var r = Math.floor(Math.random() * 256);//向下取整
				var g = Math.floor(Math.random() * 256);
				var b = Math.floor(Math.random() * 256);
				x= "rgb(" + r + "," + g + "," + b + ")";
				document.getElementById("time").setAttribute("style", "color: " + x + ";");
			}
		</script>
	</head>
	<body>
		<div id="time"></div>
		<script type="text/javascript">
			setInterval(show, 1000);
			setInterval(changeColor, 1000);
		</script>
	</body>
</html>
